<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    h1{
      color: red;
      font-size: 20px;
    }
    .c{
    color: green;
    font-size: 20px;
    /* 
    去除下划线 */
    text-decoration: none; 
    }
    #title{
      color: blue; 
    }
    p{line-height: 2;
      /* 首行缩进 */  
      text-indent: 2em;
    }
  </style>
</head>
<body>
  <h1> 123</h1>
  <img src="img/1.png">
  <!-- 定义一个一级标题，标题内容：123 -->
    <h1 id="title">124</h1>
<!-- 定义一个超链接，里面展示央视网址，点击后跳转到央视网
址，点击后跳转到央视网 -->
    <a class="c"   href="http://www.cctv.com">央视网</a>
<!-- 定义一个视频，引入video/news.mp4 -->
    <video src="video/news.mp4" controls></video>
    <audio src="audio/news.mp3"></audio>
    <p>
      <strong> &nbsp;&nbsp;123&gt;</strong>
      <b>234</b>
      <!-- 下划线 -->
      <u>345</u>
     </p>
     <input type="button"  id="bt1" value="dj1" ">
     <input type="button"  id="bt2" value="dj2" onclick="test()">
     <script src="./event.js" type="module">
      // let bt1=document.querySelector("#bt1").addEventListener("click",test);
      // let bt1=document.querySelector("#bt1").addEventListener("click",()=>{alert("12345")});//可以多次绑定同一事件
      // let bt1=document.querySelector("#bt1").addEventListener("click",()=>{alert("123456")});//可以多次绑定同一事件
      //mouseover 鼠标移入事件，mouseout 鼠标移出事件,mouseenter 鼠标移入事件，mouseleave 鼠标移出事件,click 鼠标点击事件
      //keydown 键盘按下事件，keyup 键盘抬起事件,keypress 键盘按下事件
      // focus 焦点事件,blur 焦点事件
      // change 改变事件,input 输入事件,submit 提交事件,reset 重置事件
      // let bt1=document.querySelector("#bt1").addEventListener("mouseover",test);
      // let bt1=document.querySelector("#bt1").onclick=test;//test() error;
      let bt1=document.querySelector("#bt1").onclick=()=>{alert("123")};//如果多次绑定同一事件，只能绑定最后一个，覆盖
  
      function test(){
      alert("123")
      }
      // window.test=function(){
      //   alert("123")
      // }
      // let a=function(){
      //   alert("456")
      // }
      // a();
      // let b=()=>{
      //   alert("789");
      // }
      // b();
      let user={name:"123",
      age:123,
    say(){
      alert(this.age+this.name+"123");
    alert(`${this.age}${this.name}1234`);
},
//say:function(){}
say1:()=>{
  alert(this.age+this.name+"1235");//this.age undefined this.name undefined this指向当前的父类
  }
}
  // user.say();
  // user.say1();

  let user1 = {name:"456",
  age:456,
  }
   console.log(JSON.stringify(user1));
  // alert(JSON.stringify(user1));
  let user2 = '{"name": "789","age":789}';
 alert(JSON.parse(user2).name);
     </script>

</body>
</html>